import {AigcTabBarItem} from '@/components/TabBar/type';
import AigcIcon from '@/components/Icon';
import Home from '@/view/Home';
import Mine from '@/view/Mine';
import AddScreen from '@/view/Add';
import React from 'react';
import Health from '@/view/Health';
import Vip from '@/view/Vip';
import Shop from '@/view/Shop';
import {Box, Button, HStack, Pressable, Text, VStack} from 'native-base';
import Location from '@/components/Location';
export const tabBars: AigcTabBarItem[] = [
  {
    title: '首页',
    key: 'home',
    component: Home,
    icon: <AigcIcon iconName={'\ue616'} fontSize={20} />,
    showHeder: true,
    headerLeft: () => {
      return <Location ml={'2'}></Location>;
    },
    headerTitle: (props: any) => {
      return (
        <Pressable
          onPress={() => {
            props.navigation.navigate('search');
          }}>
          <HStack
            size={'auto'}
            rounded={'2xl'}
            w={'150'}
            h={'30'}
            borderWidth={'1'}
            borderColor={'coolGray.400'}
            alignItems={'center'}>
            <AigcIcon iconName={'\ue645'} ml="2" color={'coolGray.800'} />
            <Text color={'coolGray.400'} w={'3/4'}>
              请搜索商品、医生、宠物
            </Text>
          </HStack>
        </Pressable>
      );
    },
    activeIcon: (
      <AigcIcon iconName={'\ue64e'} color={'#1296db'} fontSize={20} />
    ),
  },
  {
    title: '健康',
    key: 'health',
    component: Health,
    icon: <AigcIcon iconName={'\ue632'} fontSize={20} size={'auto'} />,
    activeIcon: (
      <AigcIcon
        iconName={'\ue632'}
        color={'#1296db'}
        fontSize={20}
        size={'auto'}
      />
    ),
  },
  {
    title: '会员',
    key: 'vip',
    component: Vip,
    icon: <AigcIcon iconName={'\ue8b1'} fontSize={20} size={'auto'} />,
    activeIcon: (
      <AigcIcon
        iconName={'\ue8c5'}
        color={'#1296db'}
        fontSize={20}
        size={'auto'}
      />
    ),
  },
  {
    title: '商城',
    key: 'shop',
    component: Shop,
    icon: <AigcIcon iconName={'\ue644'} fontSize={20} size={'auto'} />,
    activeIcon: (
      <AigcIcon
        iconName={'\ue651'}
        color={'#1296db'}
        fontSize={20}
        size={'auto'}
      />
    ),
  },
  {
    title: '我的',
    key: 'mine',
    showHeder: false,
    component: Mine,
    icon: <AigcIcon iconName={'\ue63a'} fontSize={20} />,
    activeIcon: (
      <AigcIcon iconName={'\ue617'} color={'#1296db'} fontSize={20} />
    ),
  },
];
